
<template>
  <a-modal
    :title="title"
    :width="640"
    ref="tabDialog"
    :visible="visible"
    :confirmLoading="false"
    @ok="handleOk"
    @cancel="handleCancel"
  >
    <a-spin :spinning="false">
      <a-form :form="form">
        <a-row>
          <a-col :span="24">
            <a-form-item label="角色代码">
              <a-input
                placeholder="请输入角色代码"
                v-decorator="['detail', { rules: [{ required: true }] }]"
              />
            </a-form-item>
          </a-col>
          <a-col :span="24">
            <a-form-item label="角色名">
              <a-input
                placeholder="请输入角色名"
                v-decorator="['email', { rules: [{ required: true }] }]"
              />
            </a-form-item>
          </a-col>

          <a-col :span="24">
            <a-form-item label="描述">
              <a-input
                placeholder="请输入描述"
                v-decorator="['address', { rules: [{ required: true }] }]"
              />
            </a-form-item>
          </a-col>

          <a-col :span="24">
            <a-col :span="11">
              <a-form-item label="是否启用">
                <a-radio-group
                  v-decorator="['amount', { rules: [{ required: true }] }]"
                  @change="seleChange"
                >
                  <a-radio :value="0">否</a-radio>
                  <a-radio :value="1">是</a-radio>
                </a-radio-group>
              </a-form-item>
            </a-col>
          </a-col>
        </a-row>
      </a-form>
    </a-spin>
  </a-modal>
</template>

<script>
import { postForm, postAction, putAction, getAction, deleteAction } from '@/api/manage'
import pick from 'lodash.pick'
export default {
  name: 'DeviceDetail',
  components: {},
  data() {
    return {
      title: '新增',
      form: this.$form.createForm(this),
      visible: false,
      data: {},
      url: {},
    }
  },
  created() {},
  methods: {
    handleOk(e) {
      this.visible = false
    },
    handleCancel(e) {
      this.visible = false
    },
    seleChange() {},
    show(record) {
      this.visible = true
      this.$nextTick(() => {
        this.form.setFieldsValue(pick(record, 'detail', 'email', 'address'))
      })
    },
  },
}
</script>
<style lang="less" scoped>
.device-detail {
  padding: 0 24px 24px;
  max-height: 600px;
  overflow: auto;
  background: #ffffff;
  /deep/ .ant-tabs.ant-tabs-card > .ant-tabs-bar .ant-tabs-tab {
    padding: 0 12px !important;
    border-bottom: 1px solid #e8e8e8 !important;
  }
}
</style>